
/**
* Theme: Velonic Admin Template
* Author: Coderthemes
* Morris Chart
*/

!function($) {
    "use strict";

    var MorrisCharts = function() {};

    //creates line chart
    MorrisCharts.prototype.createLineChart = function(element, data, xkey, ykeys, labels, lineColors) {
        Morris.Line({
          element: element,
          data: data,
          xkey: xkey,
          ykeys: ykeys,
          labels: labels,
          resize: true, //defaulted to true
          lineColors: lineColors
        });
    },
     //creates Donut chart
    MorrisCharts.prototype.createDonutChart = function(element, data, colors) {
        Morris.Donut({
            element: element,
            data: data,
            colors: colors
        });
    },
    MorrisCharts.prototype.init = function() {

        //create line chart
        var $data  = [
            { y: '2017-06-16', a: 100, b: 90 , c: 75 , d: 80},
            { y: '2017-06-18', a: 75,  b: 65 , c: 50 , d: 80},
            { y: '2017-06-20', a: 50,  b: 40 , c: 30 , d: 80},
            { y: '2017-06-22', a: 75,  b: 65 , c: 50 , d: 80},
          ];
        this.createLineChart('q-morris-line', $data, 'y', ['a', 'b','c','d'], ['爆品销售', '预约报名', '活动报名','H5活动推广'], ['#ff5a56', '#f8a01e', '#00aeae','#338ee3']);
        
        //creating donut chart
        var $donutData = [
                {label: "总客户数", value: 12},
                {label: "总用户数", value: 30},
                {label: "用会员数", value: 20}
            ];
        this.createDonutChart('morris-donut-example', $donutData, ['#00aeae', '#338ee3', '#717cb6']);
    },
    //init
    $.MorrisCharts = new MorrisCharts, $.MorrisCharts.Constructor = MorrisCharts
}(window.jQuery),

//initializing 
function($) {
    "use strict";
    $.MorrisCharts.init();
}(window.jQuery);